<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/common/taglibs.jsp" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <%@ include file="/common/common-css.v2.jsp" %>
    <style>
        #jquery-table td {
            cursor: pointer !important;
            word-break: break-all;
            word-wrap: break-word;
        }

        .load_bg {
            background: #000;
            opacity: 0.1;
            left: 0;
            top: 0;
            position: fixed;
            height: 100%;
            width: 100%;
            overflow: hidden;
            z-index: 10000;
        }

        .load_img {
            left: 50%;
            top: 180px;
            position: fixed;
            height: 50px;
            overflow: hidden;
            z-index: 20000;
        }

        .dialog-box {
            position: fixed;
            right: 200px;
            top: 200px;
            background-color: #fff;
            padding: 15px;
            box-shadow: 1px 1px 3px rgba(0,0,0,.5);
            z-index: 9999;
            border: 1px solid #ddd;
            display: none;
        }

        .dialog-box td {
            height: 20px;
            padding: 5px;
        }

        .btn-box {
            text-align: center;
        }

        .td-title {
            text-align: right;
        }
    </style>
</head>
<body class="no-skin">
<div class="load_bg" style="display:none;"></div>
<img src="http://img.xmiles.cn/commentloading.gif" class="load_img" style="display:none"/>

<div class="page-content">
    <form id="queryForm">
        <div class="page-content-area">
            <div class="row">
                <div class="col-sm-12">
                    <div class="widget-box" style="border:0 solid #ccc; border-top:none;border-bottom:none;">
                        <div class="widget-header widget-header-blue widget-header-flat">
                            <h4 class="widget-title">选择条件进行查询</h4>

                            <div class="widget-toolbar">
                                <a href="#" data-action="collapse">
                                    <i class="ace-icon fa fa-chevron-up"></i>
                                </a>
                            </div>
                        </div>

                        <div class="widget-body">
                            <div class="widget-main clearfix">
								
								<!--  根据时间查询   -->
							   <div class="form-group col-xs-12 col-sm-4 "> 
									<label class="col-sm-2 control-label"  style="text-align:right"  for="sex">时间:</label>
									<div class="col-sm-6">
										<div class="input-daterange input-group col-sm-12">
											<input type="text" data-date-format="yyyy-mm-dd hh:ii" class="fromDate date-picker input-sm form-control" style="padding-left:0px" name="startTime">
											<span class="input-group-addon" style="width:6px">
												<i class="fa fa-exchange"></i>
											</span>
											<input type="text" data-date-format="yyyy-mm-dd hh:ii" class="endDate date-picker input-sm form-control" style="padding-left:0px" name="endTime">
										</div>
									</div>
								</div>
								
								<div class="form-group col-xs-12 col-sm-4">
							        <label class="col-sm-4 control-label" style="text-align:right" for="orderPhone">回拉类型:</label>
							        <div class="col-sm-4">
										<div class="input-daterange input-group col-sm-12">
												<s:select id="type" name="type" list="%{paramsMap.typeList}" listKey="day_mode" listValue="day_mode" 
												headerKey="" headerValue="------请选择------" cssClass="form-control"></s:select>
										</div>
									</div>
								</div>

                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-md-12 center">
                    <div class="clearfix form-actions">
                        <button class="btn btn-purple no-border" type="button" name="btn-query" onclick="query()"
                                id="btn-query">
                            <i class="ace-icon fa fa-search icon-on-right bigger-110"></i>
                            查询
                        </button>
                        &nbsp;&nbsp;&nbsp;
                        <button class="btn btn-grey no-border" type="reset">
                            <i class="ace-icon fa fa-undo icon-on-right bigger-110"></i>
                            重置
                        </button>
                    	&nbsp;&nbsp;&nbsp;
                    	<a href="javascript:void(0)" class="btn btn-success btn-small" onclick="add(-1)">
                    	 	<i class="ace-icon fa fa-plus icon-on-right bigger-110"></i>
           	     新增
                    	</a>
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-xs-12">
                    <table id="jquery-table" class="table table-striped table-bordered table-hover">
                    </table>
                </div>
            </div>

        </div>
    </form>
</div>

<%@ include file="/common/common-js.jsp" %>
<script type="text/javascript" src="${ctx}/js/call_func.js"></script>
<script type="text/javascript">

var loadDom = $('.load_bg,.load_img');
    var jqTable = null;
	
    function query() {
        loadDom.show();
        if (jqTable != null) {
            jqTable.fnDraw();
        }
        else {
            loadData();
        }
    }

    var loadData = function () {
        jqTable = $('#jquery-table').dataTable({
            "columnDefs": [
					{	  
						  "title":'创建时间',
						  "targets": [0],
						  "data": "cdate",
						  "class": "center",
						  "width": "5%",
						  "bSortable": false
					},
					{	  
						  "title":'状态',
						  "targets": [1],
						  "data": "status",
						  "class": "center",
						  "width": "5%",
						  "bSortable": false,
						  "render": function(value, type, row) {
							  if ("1" == value) {
								  return "可用";
							  } else if ("0" == value) {
								  return "不可用";
							  } else {
								  return value;
							  }
						  }
					},
					{	  
						  "title":'回拉类型',
						  "targets": [2],
						  "data": "day_mode",
						  "class": "center",
						  "width": "5%",
						  "bSortable": false,
						  "render": function(value, type, row) {
							  return value;
						  }
					},
					{	  
						  "title":'产品',
						  "targets": [3],
						  "data": "prd_id",
						  "class": "center",
						  "width": "5%",
						  "bSortable": false,
						  "render": function(value, type, row) {
							  switch (value) {
							case "-1":
								return "车主无忧";
								break;
							case "8000":
								return "菠萝贷主包";
								break;
							case "8001":
								return "极速借钱";
								break;
							case "8002":
								return "菠萝贷iOS";
								break;
							default:
								return value;
								break;
							}
						  }
					},
					{	  
						  "title":'内容',
						  "targets": [4],
						  "data": "content",
						  "class": "center",
						  "width": "5%",
						  "bSortable": false
					},
					{	  
						  "title":'备注',
						  "targets": [5],
						  "data": "remark",
						  "class": "center",
						  "width": "5%",
						  "bSortable": false
					},
					{	  
						  "title":'操作者',
						  "targets": [6],
						  "data": "operator",
						  "class": "center",
						  "width": "5%",
						  "bSortable": false
					},
					{	  
						  "title":'邮箱',
						  "targets": [7],
						  "data": "mail",
						  "class": "center",
						  "width": "5%",
						  "bSortable": false
					},
					{
						  "title":'操作',
						  "targets": [8],
						  "data": "id",
						  "class": "center",
						  "width": "5%",
						  "bSortable": false,
						  "render": function(value, type, row) {
							  if (row.status == 0) {
								  var temp = "";
							  } else {
								  var temp = "<input class='btn btn-success btn-sm' type='button' name='PK' value='编辑' onclick='edit("+ row.id +")'/>&nbsp;&nbsp;" + 
		    	  				   		     "<input class='btn btn-success btn-sm' type='button' name='PK' value='下线' onclick='look("+ row.id +")'/>";
							  }
                       		return temp;
			    	  	  }
			    	}
            ],
            "sAjaxSource": ctx + "/pullBackMessage/pullBackMessageList.action",
            "fnServerData": function (url, aoData, fnCallback) {
                var data = $('#queryForm').serializeObject();
                data.aoData = JSON.stringify(aoData);
                $.ajax({
                    "type": "POST",
                    "dataType": 'json',
                    "url": url,
                    "data": data,
                    "success": function (resp) {
                        try {
                            fnCallback(resp);
                        } catch (e) {
                            alert(e.name + ' :' + e.message)
                        }
                    },
                    "error": function (XMLHttpRequest, textStatus) {
                        alert(textStatus);
                        loadDom.hide();
                    },
                    "complete": function () {
                        loadDom.hide();
                    }
                });
            },
            "sScrollXInner": "100%",
            "sScrollY": "100%",
            "aaSorting": [[0, "asc"]]
        });
    };

	jQuery(function() {
		$(".date-picker").datepicker({
			autoclose : true
		}).next().on(ace.click_event, function() {
			$(this).prev().focus();
		});
		$("#type").combobox();
	});
    
   	function add(id) {	
    	titleinfo = "新增短信回拉模版" ;
    	openDialogWithRand("/pullBackMessage/sendPullBackMessagePage.action",800,800,titleinfo,function (data){jqTable.fnDraw();});
	}
   	
	function edit(id){
		var titleinfo = "修改短信回拉模版" ;
    	openDialogWithRand("/pullBackMessage/sendPullBackMessagePage.action?id=" + id,800,800,titleinfo,function (data){jqTable.fnDraw();});
	}
	
	function look(id){
		$.ajax({
			type: "GET",
	        url: ctx + '/pullBackMessage/sendPullBackMessage.action',
	        data:'down=' + id,
	        success: function (data) {
	        	alert("下线成功！！");
	        	query();
	        }
		});
	}
   	
</script>
</body>
</html>